<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>1-jquery介绍</title>
		<script type="text/javascript" src="js/jquery.min.js"></script>
	</head>
	<body>
		<script type="text/javascript">
			/**
			 * 1.
			 JS库，它是封装的集合(方法)，比如说,Jquery它也是一个JS库(插件)
			 常见的JS库:Juquey,zepto...
			 jquery里面有show()、hide() 元素对象（div）显示与隐藏
			 */
			/**
			 * 2.原生JS里面(JS基础-BOM-DOM)
			 * JS基础
			 * BOM 浏览器对象模型  顶级对象window
			 * DOM 文档对象模型    顶级对象document
			 * 如：让原生显示隐藏
			 * var box = document.querySelector('.box');
			 * box.style.display="none";
			 * box.style.display="block";
			 * 相关开发人员觉得在开发中原生JS相对复杂或者繁琐一点,故衍生出了相关解决办法，这个呢，表现形式之一
			 * 就是Jquery库
			 * $('.box').show();
			 * $('.box').hide();
			 */
			
			//3.封装是什么？简单理解就是把业务逻辑圈成方法
			var x = 3;
			var y = 5;
			var z = x+y;
			
			(function add(x,y){
				return x+y;
			}(3,5));
			/**
			 * 4.jquery特点
			 * 1.Jquery 轻量级  jquery2.1.4.min.js 111kb
			 * 2.浏览器兼容
			 * 3.链式编程  
			 * {
				  第一步：$('.box').css({'color':'red'})；
				  第二步: $(this).siblings().css({'color':''});
				  最终简写：$('.box').css({'color':'red'}).siblings().css({'color':''});
				}
				4.简化DOM操作
				5.插件开发(依赖的还是Jquery库，在jquery库的基础上进行相关业务开发)
				{
					<script type="text/javascript" src="js/jquery.min.js"></script>
					<script type="text/javascript">
						//编写...
					</script>
				}
				6.开源、免费（jquery.min.js主开发人员和辅助）
				<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
			 */
		</script>
	</body>
</html>
